
<div class="panel panel-primary">
	<div class="panel-heading font-160 height-53">{{target | formatPerson}}</div>
	<div class="panel-body">
		<message-error-panel ng-model="message" auto-close="true"></message-error-panel>
		<div class="bot-10" ng-if="config.editable">
			<button type="button" class="btn btn-warning btn-sm" ng-click="add(target)"><span class="glyphicon glyphicon-plus-sign"></span></button>
			<button type="button" class="btn btn-warning btn-sm" ng-if="config.generateLetter" ng-click="letter()" ng-disabled="isLoading"><span ng-class="{'glyphicon glyphicon-refresh spin' : isLoading}"></span><span ng-show="!isLoading" class="glyphicon glyphicon-file"></span></button>
		</div>
		<div>
			<table class="table">
				<thead>
					<th class="col-sm-1">#</th>
					<th class="col-sm-5">{{'DocumentDefinition.name' | translate}}</th>
					<th class="col-sm-2">{{'SinisterRequiredDocument.status' | translate}}</th>
					<th class="col-sm-2">{{'SinisterRequiredDocument.received' | translate}}</th>
					<th class="col-sm-2">{{'options' | translate}}</th>
				</thead>
				<tbody>
					<tr ng-if="requiredDocumentation.target.id == target.id" ng-repeat="requiredDocumentation in requiredDocumentationList">
						<td>{{$index + 1}}</td>
						<td>{{requiredDocumentation.documentDefinition.name}}</td>
						<td>
							<div select-enum ng-model="requiredDocumentation.status" enum-name="SinisterDocumentStatus"></div>
						</td>
						<td>
							<div calendar ng-model="requiredDocumentation.received" ng-if="requiredDocumentation.status == 'DELIVERED'"></div>
						</td>
						<td class="vert-align">
							<div>
								<button ng-if="config.editable" type="button" class="btn btn-warning btn-sm" ng-click="edit(requiredDocumentation)"><span class="glyphicon glyphicon-edit"></span></button>
								<button ng-if="config.editable" type="button" class="btn btn-warning btn-sm" ng-click="remove($index)"><span class="glyphicon glyphicon-trash"></span></button>
								<button ng-if="requiredDocumentation.id != null" type="button" popover-title="{{'requiredDates' | translate}}" popover-popup-delay="300" 
								popover-placement="right" popover-trigger="mouseenter" ng-mouseover="getSinisterRequiredDocumentDates(requiredDocumentation.id)" 
								popover="{{sinisterRequiredDocumentDates}}" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-eye-open"></span></button>
							</div>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
</div>